<template>
  <ul class="mui-table-view">
    <li class="mui-table-view-cell mui-media" v-for="item in list" :key='item.id'>
        <router-link :to="'/home/newsinfo/'+ item.id">
        <img class="mui-media-object mui-pull-left" :src="item.img">
            <div class="mui-media-body">
                <h3>{{ item.title }}</h3>
                <p class='mui-ellipsis'>{{ item.addTime }}
                  <span>点击：{{ item.click }}次</span>
                </p>
            </div>
        </router-link>       
    </li>
</ul>
</template>
<script>
import { Toast } from 'mint-ui'
export default {
 data(){
   return {
     list:[]
   }
 },
 methods:{
   getNewsList(){
     this.$http.get('getnewslist').then(result =>{
       console.log(result)
       if(result.status === 200){
         this.list = result.body.newsList
       }else{
         Toast('获取新闻列表失败')
       }
     })
   }
 },
 created(){
   this.getNewsList()
 } 
}
</script>
<style lang="scss" scoped>
  .mui-table-view{
    li{
      h3{
        font-size: 14px;
      }
      .mui-ellipsis{
        font-size: 12px;
        color: #226aff;
        display: flex;
        justify-content: space-between;
      }
    }
  }
</style>